import { FC, lazy, Suspense } from "react"
import { RouteObject, useRoutes } from "react-router-dom"
// 引入组件
// import Test from '@/pages/Test'
import Reg from "@/pages/Reg"
import Login from "@/pages/Login"
import Layout from "@/pages/layout/layout"
import Cinema from "@/pages/layout/Cinema"
import Movie from "@/pages/layout/Movie"
import Mine from "@/pages/layout/Mine"
import City from "@/pages/City"
import Plan from "@/pages/Plan"

const Seats = lazy(() => import(/* webpackChunkName: "Seats'" */ "../pages/Seats"))

// 集中式路由管理
const routeList: RouteObject[] = [
  {
    path: "/",
    element: <Login />,
  },
  {
    path: "/reg",
    element: <Reg />,
  },
  {
    path: "/login",
    element: <Login />,
  },
  {
    path: "/layout",
    element: <Layout />,
    children: [
      {
        path: "movie",
        element: <Movie />,
      },
      {
        path: "cinema",
        element: <Cinema />,
      },
      {
        path: "mine",
        element: <Mine />,
      },
    ],
  },
  {
    path: "/city",
    element: <City />,
  },
  {
    path: "/plan",
    element: <Plan />,
  },
  {
    path: "/seats",
    element: (
      <Suspense>
        <Seats />
      </Suspense>
    ),
  },
]

const RenderRouter: FC = () => {
  return useRoutes(routeList)
}

export default RenderRouter
